<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Eric
  Date: 2019/9/28
  Time: 0:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>导游详情页</title>
    <link rel="stylesheet" href="${path}/plugins/bootstrap/css/bootstrap.css" type="text/css">
    <link rel="stylesheet" href="${path}/css/daoyou/Details.css " type="text/css">

    <link rel="stylesheet" type="text/css" href="${path}/css/daoyou/Indexhead.css">

    <link rel="stylesheet" href="${path}/css/daoyou/style.css ">
    <link rel="stylesheet" href="${path}/css/daoyou/comment.css">

    <link href="${path}/H+/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${path}/H+/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="${path}/H+/js/plugins/fancybox/jquery.fancybox.css" rel="stylesheet">
    <link href="${path}/H+/css/animate.css" rel="stylesheet">


    <!-- 引入外部的css样式 -->
    <link rel="stylesheet" href="${path}/plugins/bootstrap/css/animate.css" type="text/css">
    <link rel="stylesheet" href="${path}/plugins/bootstrap/css/font-awesome.css?v=4.4.0" type="text/css">
    <!-- 引用自己写的css样式 -->
    <link href="${path}/css/index/index.css" rel="stylesheet" type="text/css">

</head>

<body>

<%@include file="../common/nav_top.jsp"%>
<!-- 缓冲区 -->

<div class="z-banner h">
    <div class="z-ban-bg"></div>
    <div class="container">

        <div class="d-ta">
            <div class="a"
                 style="font-size:38px;height: 55px;overflow: hidden;margin-bottom: 10px;text-shadow: 0.588px 0.809px 2px rgba(0, 0, 0, 0.16);">
                <strong>苏州导游网约导游</strong>
            </div>
            <h1 class="b" style="overflow: hidden;height: 30px;">苏州自由行就找苏州当地达人${guideIndex.guideApply.actualName}</h1>
        </div>
    </div>
</div>


<!-- 缓冲区 end -->


<!-- 导游个人简介 -->
<div class="container" style="margin-top: 20px;">
    <div class="row">
        <div>
            <div>

                <img id="daoyouheadimg" class="a f1" src="${guideIndex.guideInfo.photo}">

            </div>

            <div class="col-md-7 col-xs-6 f1 ">
                <h2 class="a">
                    <b class="a1 f1">${guideIndex.guideApply.actualName}</b>
                    <em class="a2 f1">

                        <c:choose>

                            <c:when test="${guideIndex.guideInfo.grade==1}">青铜导游</c:when>
                            <c:when test="${guideIndex.guideInfo.grade==2}">白银导游</c:when>
                            <c:when test="${guideIndex.guideInfo.grade==3}">钻石导游</c:when>

                        </c:choose>
                    </em>
                    <span title="已认证" class="c"></span>

                    <i class="f1 dyheadphone"></i>
                    <span class="f1" style="font-size:16px;">${guideIndex.guideApply.guidePhone}</span>

                    <span class="f1" style="font-size:16px;">
                            <i class="f1 a3"></i>人气
                            <em id="renqinum" style="margin: 0 5px;">${guideIndex.praise}</em>
                            <a style="color: #8ec31f;" onclick=AddUserRenQi(${guideIndex.guideInfo.id})>给我投票</a>
                        </span>
                </h2>
                <div class="b">
                    <P class="b1">
                        <em style="margin-right:40px;">Ta居住在:  &nbsp;${guideIndex.guideApply.currentAddress}</em>
                    </P>
                    <P class="b1">
                        <em style="margin-right:40px;">出行路线:  &nbsp;${guideRoute.guideText}</em>
                    </P>
                    <p class="b1">
                        Ta的专长：
                        <c:forEach items="${guideIndex.guideLaber}" var="flag">

                        ${flag.plaber}    &nbsp;
                        </c:forEach> </p>
                    <p class="b1">
                        个人介绍：
                        ${guideIndex.guideInfo.profile}
                    </p>
                </div>


            </div>
            <div class="fr " style="text-align: center;">
                <a title="杭州导游胡娜娜" style="text-decoration: none">
                    <img style=" padding: 10px 20px;"
                         src="https://dycom.oss-cn-hangzhou.aliyuncs.com/userfiles/ListImg/20181204/a15a21871bf845799634fdd3aa89b597174843.png"
                         alt="杭州导游胡娜娜" class="imgs">

                </a>
                <a style="text-decoration: none">
                    <%--一个是用户的id  一个是导游的id--%>
                    <input type="text"  id="pageid" value="${guideIndex.guideInfo.id}" style="display: none">
                    <button type="button" onclick="loggin(${guideIndex.guideInfo.id})" class="btn btn-warning">预约</button>
                </a>
            </div>
        </div>
    </div>
</div>
<!-- 导游个人简介end -->

<%--照片--%>


<div class="wrapper wrapper-content gray-bg">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">

                <div class="ibox-content" style="text-align: center">

                    <c:if test="${guideIndex.photos.size()!=0}">
                        <c:forEach items="${guideIndex.photos}" var="img">
                            <a class="fancybox" href="${img.imgs}" title="">
                                <img alt="image" src="${img.imgs}" style="width: 300px;height:300px; " />
                            </a>
                        </c:forEach>
                    </c:if>
                    <c:if test="${guideIndex.photos.size()==0}">
                        <a class="fancybox" href="http://py5ztkhmu.bkt.clouddn.com/127a3000-3dfc-4cdb-ae83-58eddb0a55c5.jpg" title="">
                            <img alt="image" src="http://py5ztkhmu.bkt.clouddn.com/127a3000-3dfc-4cdb-ae83-58eddb0a55c5.jpg" style="width: 270px;height:300px; " />
                        </a>
                    </c:if>


                </div>
            </div>
        </div>
    </div>
</div>
<%--照片--%>


<div id="commonsPage">

</div>

<%@include file="../common/nav_bottom.jsp"%>

<!-- 全局js -->
<script src="${path}/H+/js/jquery.min.js?v=2.1.4"></script>
<script src="${path}/H+/js/bootstrap.min.js?v=3.3.6"></script>



<!-- Peity -->



<script src="${path}/H+/js/plugins/peity/jquery.peity.min.js"></script>



<script type="text/javascript" src="${path}/js/daoyou/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="${path}/js/daoyou/jquery.flexText.js"></script>

<!-- Fancy box -->
<script src="${path}/H+/js/plugins/fancybox/jquery.fancybox.js"></script>


<script>

    $(function(){
        //如果js和jsp在同一个文件中,那么可以在js中使用EL表达式
        //如果js是单独的外部文件,则不允许使用EL表达式

        $("#commonsPage").load("${path}/guide/getpage/"+$("#pageid").val());
    });

    $(document).ready(function () {
        $('.fancybox').fancybox({
            openEffect: 'none',
            closeEffect: 'none'
        });
    });

</script>
<script>

function AddUserRenQi(obj) {

    $.post("${path}/guidehome/addPraise",{id:obj},function (data) {
        console.log(data);
        if(data.flag){

            document.getElementById("renqinum").innerHTML=data.data;
        }else{
            alert(data.message)
        }

    })

}

    function loggin(obj2) {
        var p= "${path}/guide/reservation/"+obj2.toString();
        window.location=p;
    }


</script>

</body>

</html>